<template>
	<view class="page">
		<view class="wrapper" v-if="balance!=''">
			<view class="t-r f_28 navy_blue" @click="pageTo('/pages/teacher/my_account_detail/index')">明细</view>
			<view class="balance t-c" >
				<text class="f_32">￥</text><text class="f_72">{{balance}}</text>
			</view>
			<view :class="['btn',Number(this.balance)>0?'btn_active':'btn_default']" @click="Withdraw">
				提现
			</view>
		</view>
		<zan-popup :show="showPopup" type="center" @close="closeCoursePopup">
			<view class="popup-box">
				<view class="info-box">
					<image class="info_icon" :src="imgPrefix('/static/image/teacher/my_account_detail_icon.png')" mode=""></image>
					<view class="info t-c">
						<view class="f_40 navy_blue margintb">未实名</view>
						<view class="gery1 f_28">{{verify==0?'您尚未进行实名认证，无法进行提现，请进行认证':verify==1?'您的实名认证正在审核中，无法进行提现，是否再次认证？':''}}</view>
						<view class="btn f_32" @click="toCertification">去认证</view>
					</view>
				</view>
				<view class="close t-c" @click="closeCoursePopup">
					<image :src="imgPrefix('/static/image/teacher/close.png')" mode=""></image>
				</view>
			</view>
		</zan-popup>
	</view>
</template>
<!-- my_account_detail_icon.png -->
<script>
import { commonMixinFun } from '@/static/mixins/common.js';
import zanPopup from '@/components/popup/index.vue';
import API from '@/static/api/index.js';
	export default{
		mixins: [commonMixinFun],
		components: {
			zanPopup
		},
		data(){
			return{
				showPopup: false, //是否弹出层
				balance:'',
				verify:'',//是否已认证
			}
		},
		onShow() {
			this._getTeacherMoney()
		},
		methods:{
			//去认证
			toCertification(){
				this.closeCoursePopup()
				this.pageTo('/pages/teacher/write_info/index')
			},
			Withdraw(){
				//0已拒绝审核 1未通过审核
				if(this.verify==0||this.verify==1){
					this.closeCoursePopup()
				}else{
					if(Number(this.balance)>0){
						this.pageTo('/pages/teacher/withdraw/index')
					}
				}
			},
			closeCoursePopup(delay = 0) {
				setTimeout(() => {
					this.showPopup = !this.showPopup;
				}, delay);
			},
			_getTeacherMoney(){
				API.getTeacherMoney().then(res=>{
					if(res.code==1){
						this.balance=res.data.money
						this.verify=res.data.verify
					}else{
						this.showToast(res.msg)
					}
				})
			}
		}
	}
</script>

<style scoped lang="scss">
.wrapper{
	padding: 48rpx;
	background-color: white;
	.balance{
		.f_72{font-size: 72rpx;}
		text{
			margin-right: 2rpx;
		}
		padding: 88rpx 0 160rpx 0;
	}
	.btn{
		line-height: 92rpx;
		text-align: center;
		border-radius: 16rpx;
	}
	.btn_active{
		background-image: linear-gradient(270deg, 
			#7f4aff 0%, 
			#9254ff 100%);
			color: white;
	}
	.btn_default{
		background-color: #f0f0f6;
		color: #d1d2db;
	}
}
.popup-box{
	.info-box{
		background-color: white;
		width: 606rpx;
		background-color: #ffffff;
		border-radius: 24rpx;
		.info_icon{
			width: 100%;
			height: 272rpx;
			background-color: #f4f5f9;
			border-radius: 24rpx 24rpx 0rpx 0rpx;
		}
		.info{
			padding: 0 64rpx 32rpx 64rpx;
			.margintb{
				margin: 22rpx 0 20rpx 0;
			}
			.btn{
				line-height: 92rpx;
				background-image: linear-gradient(270deg, 
					#9254ff 0%, 
					#7f4aff 100%);
				border-radius: 16rpx;
				color: #ffffff;
				margin-top: 32rpx;
			}
		}
	}
	.close{
		margin-top: 88rpx;
		image{
			width: 80rpx;
			height: 80rpx;
		}
	}
}
</style>
